<!-- 计分方式：选项数量 个人 -->

<!-- 报告名称 -->
<h2>{$qaMain['title']}</h2>

<!-- 问答人信息 -->
<div class="top_info">
    {if $wxapp < 1} <div class="nowrap left" style="width: 50%;">测&ensp;评&ensp;人：{$data['userName']}</div>
<div class="nowrap left" style="width: 25%;">性&emsp;&emsp;别：{$data['sex']}</div>
<div class="nowrap left" style="width: 25%;">年&emsp;&emsp;龄：{$data['age']}</div>
{/if}
<div class="nowrap left" style="width: 50%;">问答单位：{$asOrder['team_name']}</div>
<div class="nowrap left" style="width: 50%;">问答时间：{$asRecord['update_time']}</div>
</div>

<!-- 评估标准 -->
<div>
    <p>{$qaMain['standard']}</p>
</div>

<!-- <h3>总体评估</h3> -->
<h3>评估结果：{$data['resultWxapp']['resultMsg']}</h3>

<!-- 因子得分 雷达图 -->
{notempty name="data.classifyScore"}
<div class="bar_chart">
    <div id="circleChart" style="width: 100%;height:300px;"></div>
</div>

<!-- 因子得分 表格 -->
{if $wxapp < 1} <div class="classify_score_table">
    <table class="table" border="1" cellpadding="3" cellspacing="1">
        <tr>
            <th>因子</th>
            {foreach $data.categories as $key=>$vo }
            <th>{$vo.classify}</th>
            {/foreach}
        </tr>
        <tr>
            <th>得分</th>
            {foreach $data.categories as $key=>$vo }
            <td class="nowrap" style="color: {$vo.color};">{$vo.value}</td>
            {/foreach}
        </tr>
    </table>
    </div>
    {else /}

    <div class="classify_score_table">
        <table class="table" border="1" cellpadding="3" cellspacing="1">
            <tr>
                <th>因子</th>
                <th class="nowrap" width="20%">得分</th>
            </tr>
            {foreach $data.categories as $key=>$vo }
            <tr>
                <td>{$vo.classify}</td>
                <td class="nowrap" style="color: {$vo.color};">{$vo.value}</td>
            </tr>
            {/foreach}
        </table>
    </div>
    {/if}
    {/notempty}

    <ul class="report-list">
        {foreach $data.classifyScore as $key=>$vo }
        <li class="factor">
            <div><b style="margin-top:0;">{$vo.result_msg}：{$vo.value}分</b></div>
            <!-- 因子介绍 -->
            {notempty name="vo.standard"}
            <div class="result_msg">{$vo.standard}</div>
            {/notempty}
        </li>
        <hr>
        {/foreach}
    </ul>

    <!-- 问答介绍 -->
    <div style="margin-top: 2em;">
        <p>{$qaMain['content']}</p>
    </div>

    <!-- 公众号 客服号 [二维码入口] -->
    <div class="qr_img_list">
        <div>
            <img src="{$data['companyInfo']['img_wx_official']}">
            <div>公众号</div>
        </div>
        <div>
            <img src="{$data['companyInfo']['img_wx_service']}">
            <div>公众号</div>
        </div>
    </div>

    <script type="text/javascript">
        $(function () {
            // 基于准备好的dom，初始化echarts实例
            var circleChart = echarts.init(document.getElementById('circleChart'), null, {
                // renderer: 'canvas',
                renderer: 'svg',
                useDirtyRect: false
            });

            var circleChartOption = {
                // title: {
                //     text: '总体评估',
                //     subtext: '',
                //     left: 'center'
                // },
                radar: {
                    shape: 'circle',
                    indicator: $.parseJSON('{$data["radarIndicator"]}')
                },
                series: [{
                    data: [{
                        value: $.parseJSON('{$data["seriesData"]}'),
                        itemStyle: {
                            color: '#64b4fa'
                        },
                        areaStyle: {
                            opacity: 0.5
                            // color: 'rgba(90, 180, 250, 0.5)'
                        },
                        lineStyle: {
                            // color: 'rgba(90, 180, 250, 0.9)'
                            opacity: 1
                        },
                        // symbolSize: '',
                        // label: {
                        //     show: true,
                        //     // color: '#ffffff',
                        //     // position: 'inside', //outside inner
                        //     formatter: function(params) {
                        //         return params.value;
                        //     }
                        // }
                    }],
                    emphasis: {
                        label: {
                            show: true,
                            fontSize: '0.5em',
                            // fontWeight: 'bold'
                        }
                    },
                    type: 'radar'
                }]
            };

            // 使用刚指定的配置项和数据显示图表。
            circleChart.setOption(circleChartOption);
        });
    </script>

    <style>
        .classify_score_table {
            padding: 10px 8px;
        }

        .classify_score_table table {
            width: 100%;
            text-align: center;
            border-collapse: collapse;
        }

        .classify_score_table table th {
            background-color: lightgray;
            font-weight: normal;
            width: 1.5em;
        }
    </style>